<template>
  <view>
    <view class="content relative">
      <view class="shadow"></view>
      <view class="list_box">
        <view class="list">
          <view class="item title_box u-f-ac u-f-jsb">
            <view class="time u-f-ajc" style="width: 50%">时间</view>
            <view class="u-f-ajc" style="width: 50%">投入彩蛋</view>
            <!-- <view class="u-f-ajc" style="width: 20%">是否中奖</view> -->
            <!-- <view class="u-f-ajc" style="width: 33.3%">积分数量</view> -->
          </view>

          <view class="item u-f-ac u-f-jsb" v-for="(item, index) in list" :key="index">
            <view class="time u-f-ajc" style="width: 50%">{{item.pool_time | date('mm-dd hh:MM:ss') }}</view>
            <view class="u-f-ajc" style="width: 50%;">
              <image :src="item.image" mode="widthFix"></image>
              <view style="margin-left: 10rpx;">{{item.name}}</view>
            </view>
            <!-- <view class="u-f-ajc" style="width: 33.3%">是</view> -->
            <!-- <view class="u-f-ajc" style="width: 33.3%">0</view> -->
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  import * as API_Mall from '@/api/malls.js';
  export default {
    data() {
      return {
        eggList: [],
        list: [],
        params: {
          pageNo: 1,
          pageSize: 10,
          eggId: '',
          buyOrPool: false,
          poolId: '',
        },
      }
    },
    onLoad() {
      this.getCrazyMyEggs()
    },
    methods: {
      async getCrazyEgg() {
        let res = await API_Mall.getCrazyEgg()
        this.eggList = res
      },
      async getCrazyMyEggs() {
        let res1 = await API_Mall.getCrazyAnnouncement()
        this.params.poolId = res1.pools_id

        await this.getCrazyEgg()
        let res = await API_Mall.getCrazyMyEggs(this.params)

        let arr = []
        for (let i of res.data) {
          let obj = {
            name: '',
            image: '',
            egg_id: i.egg_id,
            pool_time: i.pool_time,
          }
          obj.name = this.eggList.find(item => item.id == i.egg_id).name
          obj.image = this.eggList.find(item => item.id == i.egg_id).thumbnail
          arr.push(obj)
        }
        this.list = arr
        console.log(this.list)
      },


    },
  }
</script>

<style lang="scss">
  page {
    background-color: #E91536;
  }

  .content {
    padding: 60rpx 30rpx 200rpx;

    .shadow {
      width: 100%;
      height: 120rpx;
      background: #C6112D;
      border-radius: 30rpx;
    }

    .list_box {
      margin-top: -90rpx;
      width: 100%;
      padding: 0 10rpx;
    }

  }

  .list {
    width: 100%;
    background: #FFFCF0;
    border: 1px solid #FF6264;
    box-shadow: 0px 0px 10rpx 2rpx #FFE478;
    border-radius: 50rpx;
    padding: 40rpx 20rpx;

    .item {
      color: #8A3D06;
      padding: 16rpx 10rpx;
      border-bottom: 1px dashed #ccc;

      >view {
        width: 33.3%;
      }

      image {
        width: 30rpx;
      }
    }

    .title_box {
      background-color: #FFEBC2;
      // background-color: red;
      border-radius: 50rpx;
      padding: 8rpx 10rpx;
      font-weight: 700;
      border-bottom: none;
      margin-bottom: 10rpx;
      font-size: 26rpx;
    }
  }
</style>